﻿@{
    Layout = null;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head">
    <title>授权管理</title>
    @Html.Css("main", "list", "form", "tree")
    @Html.Js("jquery", "common", "tree", "hash")
    <script type="text/javascript">
        var userHash = new Hash();
        $(document).ready(function () {
            var maiheight = document.documentElement.clientHeight;
            var mainWidth = document.documentElement.clientWidth;

            $("#ustree").treeview(
                {
                    url: '@Url.Action("QueryAllUserTree")',
                    showcheck: false,
                    cascadecheck: false,
                    onnodeclick: TreeNode_Click,
                    theme: "bbit-tree-arrows" //bbit-tree-lines ,bbit-tree-no-lines,bbit-tree-arrows
                }
             );

            function TreeNode_Click(data) {
                if (data.value == "org") {
                    data.expand();
                }
                else {
                    LoadP(data.id, data.text);
                }
            }

            $("#usertree").height(maiheight - 32);
            $("#uslist").height(maiheight - 32);
            $("#userlist").height(maiheight - 32);
            $("#psourcelist").height(maiheight - 32);

            function LoadP(userId, userName) {
                $("#hdCurrentUserCode").val(userId);
                $("#psourcelist").html("");
                $("#ustitle").text(userName + " 用户所拥有的权限树");
                $("#uslist").empty(); //清空权限树
                var usptree = $("<div id='usptree' style='padding:5px;'></div>");
                $("#uslist").append(usptree);
                $("#loadingpermission").show();
                usptree.treeview(
                    {
                        url: '@Url.Action("QueryUserPrivilegeTree")',
                        showcheck: false,
                        cascadecheck: false,
                        onnodeclick: p_node_click,
                        preloadcomplete: ptree_preloadcomplete,
                        extParam: [{ name: "UserCode", value: userId}],
                        theme: "bbit-tree-arrows" //bbit-tree-lines ,bbit-tree-no-lines,bbit-tree-arrows
                    });

                }
            function p_node_click(data) {
                var userCode = $("#hdCurrentUserCode").val();
                if (userCode != "") {
                    $("#loadingPSource").show();
                    $.ajax({
                        type: "POST",
                        url: '@Url.Action("QueryPrivilegeRoles")',
                        data: { "UserCode": userCode, "pCode": data.id },
                        dataType: "json",
                        success: function (rolelist) {
                            if (rolelist && rolelist.length > 0) {
                                var html = [];
                                html.push("<ul>");
                                for (var i = 0, l = rolelist.length; i < l; i++) {
                                    html.push("<li id='role_", rolelist[i][0], "'><span class='", rolelist[i][3] == "1" ? "systemrole" : "normalrole", "'>", rolelist[i][2], "</span><a href=\"javascript:void(0);\" title='修改角色授权' onclick=\"javascript:authorization('", rolelist[i][1], "','", rolelist[i][2], "')\"><span style=\"float:right\" class='authorization'>&nbsp;</span></a><a href=\"javascript:void(0);\" title='修改角色用户' onclick=\"javascript:viewUsers('", rolelist[i][1], "','", rolelist[i][2], "')\"><span style=\"float:right\" class='user'>&nbsp;</span></a></li>");
                                }
                                html.push("</ul>");
                                $("#psourcelist").html(html.join(""));
                                $("#psourcelist li").each(function (i) {
                                    $(this).hover(function (e) { $(this).addClass("hover"); }, function (e) { $(this).removeClass("hover"); })
                                });
                                $("#loadingPSource").hide();
                            }
                            else {
                                $("#psourcelist").html("");
                            }
                        }
                    });      //end if $.ajax
                }
            }
            function ptree_preloadcomplete() {
                $("#loadingpermission").hide();
            }

            // 快速检索
            var $q = $("#querytext");
            $q.focus(function (e) { // 1.当获得焦点时 隐藏水印
                if (this.value == this.alt) {
                    this.value = "";
                    $(this).addClass("querytext_onfocus");
                }
            }).blur(function (e) { // 2.当失去焦点时 显示水印
                if (this.value == "") {
                    this.value = this.alt;
                    $(this).removeClass("querytext_onfocus");
                }
            }).keypress(function (e) { // 3.在输入框中按Enter同点击查询按钮
                if (e.keyCode == 13) {
                    quickQuery();
                }
            }).val($q.attr("alt"));
            // 4.点击快速检索按钮查询数据
            $("#btnQuickQuery").click(quickQuery);
            // 5.点击清空快速检索按钮的查询所有数据
            $("#btnClearQuery").click(function (e) {
                $("#querytext").val("");
                $("#userlist").hide();
                $("#usertree").show();
                $("#btnQuickQuery").show();
                $(this).hide();
            });

            // 快速检索函数
            function quickQuery() {
                var qtext = $q.val();
                if (qtext != $q.attr("alt")) //如果有内容
                {
                    // 增加加载中的效果
                    $q.addClass("loading");
                    //发起查询请求
                    $.ajax({
                        type: "POST",
                        url: '@Url.Action("QueryUser")',
                        data: { userCode: qtext },
                        dataType: "json",
                        success: function (data) {
                            var html = [];
                            html.push("<ul>");
                            if (data) {
                                for (var i = 0, l = data.length; i < l; i++) {
                                    html.push("<li id='qli_", data[i].UserCode, "' title='", data[i].UserName, "' ", userHash.hasItem(data[i].Code) ? "class='checked'" : "", "><div class=\"usercontainer\" style=\"margin:1px 3px 1px 6px;\"><em class=\"user\" style='float:left;'>", data[i].UserName, "</em><span class='qusercheck'></span><div style='clear:both;'></div></div></li>");
                                }
                            }
                            html.push("</ul>");
                            $("#userlist").html(html.join("")).show();
                            $("#userlist li").each(function (i) {
                                $(this).hover(function (e) { $(this).addClass("hover"); }, function (e) { $(this).removeClass("hover"); })
                                .click(function (e) {
                                    var me = $(this);
                                    var id = this.id.substr(4);
                                    var text = me.attr("title");
                                    if (!me.hasClass("checked")) {
                                        $("#userlist li.checked").removeClass("checked");
                                        me.addClass("checked");
                                        LoadP(id, text);
                                    }
                                });
                            });

                            // 显示快速查询的清空按钮
                            $("#btnClearQuery").show();
                            // 隐藏组织机构用户树
                            $("#usertree").hide();
                            // 隐藏快速查询的查询按钮
                            $("#btnQuickQuery").hide();
                            // 移除加载中的效果
                            $q.removeClass("loading");
                        }
                    });      //end if $.ajax
                }
            }

        });   // end of ready

        function viewUsers(roleid, roleName) {
            var url = '@Url.Action("RoleUserRelationList")?RoleCode=' + roleid;
            OpenModelWindow(url, { caption: roleName + " 下的成员", width: 500, height: 400 });
        }
        function authorization(roleid, roleName) {
            var url = '@Url.Action("SetRolePrivilege")?RoleCode=' + roleid;
            OpenModelWindow(url, { caption: "对角色[" + roleName + "]授权", width: 300, height: 400, type: 2, onclose: function () {
                showLoadingMsg("操作成功！,请刷新页面", { left: 400, top: 1 }, true, 3000);
            }
            });
        }
    </script>
    <style type="text/css">
        .ctree
        {
            overflow: hidden;
            border: solid 1px #99bbe8;
            margin: 0px 0px 2px 2px;
            background-color: #fff;
            width: 220px;
            float: left;
        }
        .container
        {
            overflow: auto;
            border: solid 1px #99bbe8;
            background-color: #fff;
            margin: 0px -203px 2px 206px;
        }
        .rightpanel
        {
            overflow: auto;
            border: solid 1px #99bbe8;
            background-color: #fff;
            width: 380px;
            float: right;
            margin: 0px 0px 0px 2px;
        }
        body
        {
            overflow: hidden;
        }
        .user .bbit-tree-node-icon
        {
            background: url("../../Content/images/icons/user.png") no-repeat;
        }
        
        .querytext
        {
            color: #ccc;
        }
        .querytext_onfocus
        {
            color: #555;
        }
        ul, li
        {
            margin: 0;
            padding: 0;
            list-style: none;
        }
        li
        {
            line-height: 150%;
        }
        div.usercontainer
        {
            padding: 0px 0px 0px 20px;
            background: url("../../Content/images/icons/user.png") no-repeat;
        }
        input.loading
        {
            background: url("../../Content/images/icons/indicator.gif") no-repeat right center;
        }
        li .qusercheck
        {
            display: block;
            float: right;
            height: 16px;
            width: 16px;
        }
        li.hover
        {
            background-color: #eee;
            cursor: pointer;
        }
        li.checked .qusercheck
        {
            background: url("../../Content/images/icons/qcheck.gif") no-repeat center center;
        }
        .Mainpanel
        {
            margin: 2px;
        }
        .titlepanel
        {
            color: #15428b;
            font-weight: bold;
            padding-left: 16px;
        }
        .bbit-tree-selected
        {
            background-image: url("../.../Content/images/icons/qcheck.gif");
            background-position: right center;
            background-repeat: no-repeat;
        }
        .psourcelist ul
        {
            padding: 3px;
        }
        span.systemrole
        {
            padding-left: 18px;
            background: url("../../Content/images/icons/sysrole.png") no-repeat left center;
            float: left;
        }
        span.normalrole
        {
            padding-left: 18px;
            background: url("../../Content/images/icons/normalrole.png") no-repeat left center;
            float: left;
        }
    </style>
</head>
<body style="background: #dfe8f6">
    <div class="Mainpanel">
        <input type="hidden" id="hdCurrentUserCode" value="" />
        <div id="treecontainer" class="ctree">
            <div id="querypanel" class="titlepanel">
                <input type="text" id="querytext" class="querytext" alt="请输入账号或姓名" />
                <a href="javascript:void(0);" id="btnClearQuery" style="display: none"><span class="clearquery">
                    &nbsp; </span></a><a href="javascript:void(0);" id="btnQuickQuery"><span class="usequery">
                        &nbsp;</span></a>
            </div>
            <div id="usertree" style="overflow: auto;">
                <div id="ustree" style="padding: 2px;">
                </div>
            </div>
            <div id="userlist" style="display: none;">
            </div>
        </div>
        <div id="rightpanel" class="rightpanel">
            <div class="header">
                <span class="title">权限来源</span> <span id="loadingPSource" class="loadingicon">&nbsp;</span>
            </div>
            <div id="psourcelist" class="psourcelist">
            </div>
        </div>
        <div id="ucontainer" class="container">
            <div class="header">
                <span class="title" id="ustitle">请选择用户</span> <span id="loadingpermission" class="loadingicon">&nbsp;</span>
            </div>
            <div id="uslist">
            </div>
        </div>
    </div>
</body>
</html>
